<?php if (!defined('THINK_PATH')) exit();?>﻿<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>jOrgChart - A jQuery OrgChart Plugin</title>
    <link rel="stylesheet" href="__APP__/Public/css/common.css" />
    <link rel="stylesheet" href="__APP__/Public/css/public02.css" />
    <link rel="stylesheet" href="__APP__/Public/js/tree/css/bootstrap.min.css" />
    <link rel="stylesheet" href="__APP__/Public/js/tree/css/jquery.jOrgChart.css" />
    <link rel="stylesheet" href="__APP__/Public/js/tree/css/custom.css" />
    <link href="__APP__/Public/js/tree/css/prettify.css" type="text/css" rel="stylesheet" />
    <script type="text/javascript" src="__APP__/Public/js/tree/prettify.js"></script>
    <!-- jQuery includes -->
    <script type="text/javascript" src="__APP__/Public/js/tree/jquery.min.js"></script>
    <script type="text/javascript" src="__APP__/Public/js/tree/jquery-ui.min.js"></script>
    <link rel='stylesheet' href='__APP__/Public/css/jquery-ui.css' type='text/css'>
    <script src="__APP__/Public/js/tree/jquery.jOrgChart.js"></script>
    <script src="__APP__/Public/js/functions.js"></script>

</head>
<body>
    <div id="header" class="header">
        <a href="#" class="logo"></a>
        <span style="float:right;margin-top: 26px;color: black;"><?php echo L('header_tag1');?><br /><?php echo L('header_tag2');?></span> 
    </div>
    <div class="container02">
        <div class="main">
 
            <br />
            <input id="addNode" type="button" value="<?php echo (L("add")); ?>" />
            <!-- <input id="editNode" type="button" value="<?php echo (L("edit")); ?>"/> -->
            <input id="delNode" type="button" value="<?php echo (L("del_node")); ?>" />
            <input type="button" value="<?php echo (L("goback")); ?>" onclick="goback('/Users/userProfile?uid=<?php echo ($encryptid); ?>')" />
            	
	<ul id="org" style="display: none"><?php echo($tree);?></ul>      
            <div id="chart" class="orgChart">
            </div>
            <div id="genealogyInfoDialog" style="display: none;">
                <form id="form1" method="post">
                <input name='opt' type='hidden' value="<?php echo ($opt); ?>" />
                <input id='chickedNodeId' name='chickedNodeId' type='hidden' />
                <input id="uid" name="uid" type="hidden" value="<?php echo ($encryptid); ?>" />
               <table class="datalist">
    <tr>
        <td>
            <?php echo (L("firstname")); ?>:
        </td>
        <td>
            <input id="fname" name="fname" type="text" />
        </td>
    </tr>
    <tr>
        <td>
            <?php echo (L("lastname")); ?>:
        </td>
        <td>
            <input id="lname" name="lname" type="text" />
        </td>
    </tr>
    <tr>
        <td>
            <?php echo (L("secondname")); ?>:
        </td>
        <td>
            <input type="text" class="input02" name='secondname' />
        </td>
    </tr>
    <tr>
        <td>
            <?php echo (L("user_gender")); ?>:
        </td>
        <td>
            <select name="gender">
                <option value="0"><?php echo (L("female")); ?></option>
                <option value="1" selected='selected'><?php echo (L("male")); ?></option>
            </select>
        </td>
    </tr>
    <tr>
        <td>
            <?php echo (L("birthday")); ?>:
        </td>
        <td>
            <input id='birthday' name='birthday' readonly="readonly" type="text" class='input02' />
        </td>
    </tr>
    <tr>
        <td>
            <?php echo (L("deathday")); ?>:
        </td>
        <td>
            <input id='deathday' name='deathday' readonly="readonly" type="text" class='input02' />
        </td>
    </tr>
     <?php if(count($data) == 0): ?><tr>
        <td>
            <?php echo (L("user_name_list")); ?>:
        </td>
        <td>
            <select id="Select1" name="nodeId">
                <option value='0' selected><?php echo (L("empty")); ?></option>
            </select>
        </td>
    </tr>
    <input type='hidden' name='relationship' />
    <?php else: ?>
    <tr>
        <td>
            <?php echo (L("user_name_list")); ?>:
        </td>
        <td>
            <select id="node" name="nodeId">
                <?php if(is_array($data)): foreach($data as $key=>$v): ?><option value="<?php echo ($v["id"]); ?>"><?php echo ($v["name"]); ?></option><?php endforeach; endif; ?>
            </select>
        </td>
    </tr>
    <tr>
        <td>
            <?php echo (L("relation")); ?>
        </td>
        <td>
            <select id="relationship" name="relationship">
                <option value="0"><?php echo (L("parent")); ?></option>
                <option value="1" selected="selected"><?php echo (L("children")); ?></option>
            </select>
        </td>
    </tr><?php endif; ?>
</table>

                <input type='hidden' id="avatar" name='avatar' />
                <br />
                <input type="submit" value="      <?php echo (L("submit")); ?>      " class="contactbuttom" />
                </form>
            </div>
        </div>
    </div>
    <script>
        var chickedNodeId = '';
        $(function () {
            $("#org").jOrgChart({
                chartElement: '#chart',
                dragAndDrop: true,
                nodeClickCallback: function (node) {
                    $('.orgChart div').css('color', '#fff');
                    $(node).css('color', 'red');
                    chickedNodeId = $(node).attr('id');
                    $('#chickedNodeId').val(chickedNodeId);
                }
            });

            $("#addNode").click(function () {
                showDialog();
                $('#form1').attr('action', '__URL__/addGenealogy');
            });

            $('#delNode').click(function () {
                if (chickedNodeId == '') {
                    alert('<?php echo (L("pls_select_one")); ?>');
                    return false;
                }
                $.post('__URL__/deleteGenealogyChild', { id: chickedNodeId }, function (data) {
                    var obj = $.parseJSON(data);
                    if (obj.status == 0) {
                        alert('<?php echo (L("delete_failed")); ?>');
                    } else if (obj.status == 1) {
                        //alert('<?php echo (L("delete_success")); ?>');
                        location.href = '/Users/genealogy?uid=<?php echo ($encryptid); ?>&opt=<?php echo ($opt); ?>';
                    } else if (obj.status == 2) {
                    	alert('<?php addslashes($Think.lang.can_only_delete_child_node) ?>');
                    }
                });
            });

            $('#editNode').click(function () {

            });
        });

        function showDialog() {
            $('#genealogyInfoDialog').dialog({
                width: 600,
                height: 420,
                modal: false,
                title: "<?php echo (L("genealogy")); ?>",
                create: function () { },
                open: function () { },
                close: function () { }
            });

        }

        function getGenealogyData(id) {
            var url = "/Users/getGenealogyInfo";
            $.post(url, { id: id }, function (data) {
                var obj = $.parseJSON(data);
                if (obj.status == 1) {
                    setField(obj);
                }
            });
        }

        function setField(obj) {
            if (obj != null) {
                $('#fname').val(obj.data['firstname']);
                $('#lname').val(obj.data['lastname']);
            }
        }

        function finish() {
            location.href = "/Users/userProfile?uid=<?php echo ($encryptid); ?>&opt=<?php echo ($opt); ?>";
        }
	
    </script>
<!--footer开始-->
    <div id="footer">
        <div class="main">
            <div class="left">
                <a href="#">Offrir un Sourire Eternel</a></div>
            
            <div class="left ml118">
                <a href="#">｜Qui sommes nous?</a> <a href="#">｜Mentions légales</a> <!-- <a href="/Public/contactUs">｜联系我们</a> -->
            </div>
            <div class="right">
            	<a href="/Public/FAQ">FAQ</a>
                </div>
            <div class="clear">
            </div>
        </div>
    </div>
    <!--footer结束-->
</body>
</html>